<template>
	<view class="container">
		<fu-navbar :title="title" bgColor="#0f68f0" color="#fff" isBackText></fu-navbar>
		<view class="content">
			<view class="flex align-center title">
				<image class="icon" src="../../../static/images/icon23.png" mode="widthFix"></image>
				<view>验收信息</view>
			</view>
			<block v-if="type == 1">
				<view class="flex align-center justify-between border-b-c9 box" v-if="orderType != 'part'">
					<view class="label" v-if="orderType == 'upkeep' || orderType == 'rep'">验收评分</view>
					<view class="label" v-else>审核评分</view>
					<input placeholder="输入评分" placeholder-class="pla-ipt" class="ipt" v-model="acceptScore" />
				</view>
				<view class="flex box">
					<view class="label" v-if="orderType == 'upkeep' || orderType == 'rep'">验收说明</view>
					<view class="label" v-else>审核说明</view>
					<textarea placeholder="请输入内容" placeholder-class="pla-ipt" class="tar" v-model="acceptExplain"></textarea>
				</view>
			</block>
			<block v-else>
				<view class="flex box">
					<view class="label">驳回原因</view>
					<textarea placeholder="请输入内容" placeholder-class="pla-ipt" class="tar" v-model="acceptExplain"></textarea>
				</view>
			</block>
		</view>
		<view class="btn-wrap">
			<view class="bottom" v-if="orderType != 'ins'">
				<view class="btn" @click="submit">确认</view>
			</view>
			<view class="bottom flex justify-center" v-else>
				<!-- <view class="btn2 bg-green" @click="navTo(`/pages/service/repair/index`)">新增维修</view> -->
				<view class="btn2 bg-blue" @click="conform">审核完成</view>
			</view>
		</view>
	</view>
</template>

<script>
import fuNavbar from '@/components/fu-navbar/fu-navbar.vue';
export default {
	components: {
		fuNavbar
	},
	data() {
		return {
			type: '',
			acceptScore: '0',
			acceptExplain: '',
			orderId: 0,
			title: '',
			orderType: ''
		}
	},
	onLoad(option) {
		this.title = option.title || ''
		this.type = option.type || ''
		this.orderId = option.orderId || 0
		this.orderType = option.orderType || ''
	},
	methods: {
		navTo(path) {
			uni.navigateTo({
				url: path
			})
		},
		submit() {
			if (!this.acceptExplain) {
				uni.showToast({
					title: '请输入内容',
					icon: 'none'
				})
				return
			}
			if (this.orderType == 'part') {
				let type = this.type == 2 ? 3 : 2
				this.$api.post(global.apiUrls.updatePartApplyState, {
					id: this.orderId,
					operation: type,
					applyDesc: this.acceptExplain
				}).then(res => {
					if (res.data.code == 9100) {
						uni.showToast({
							title: '操作成功',
							icon: 'none'
						})
						setTimeout(() => {
							uni.switchTab({
								url: '/pages/tab/home/index'
							})
						}, 1000)
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
					}
				})
			} else {
				let url = ''
				if (this.orderType == 'rep') {
					url = global.apiUrls.acceptRepair
				} else if (this.orderType == 'upkeep') {
					url = global.apiUrls.acceptUpkeep
				}
				this.$api.post(url, {
					id: this.orderId,
					type: this.type,
					acceptScore: this.acceptScore,
					acceptExplain: this.acceptExplain
				}).then(res => {
					if (res.data.code == 9100) {
						uni.showToast({
							title: '操作成功',
							icon: 'none'
						})
						setTimeout(() => {
							uni.switchTab({
								url: '/pages/tab/home/index'
							})
						}, 1000)
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
					}
				})
			}
		},
		conform() {
			this.$api.post(global.apiUrls.updatePatrolState, {
				id: this.orderId,
				operation: 5,
				operationInfo: this.acceptExplain,
				acceptScore: this.acceptScore
			}).then(res => {
				if (res.data.code == 9100) {
					uni.showToast({
						title: '操作成功',
						icon: 'none'
					})
					uni.$emit('refresh')
					setTimeout(() => {
						uni.navigateBack()
					}, 1000)
				} else {
					uni.showToast({
						title: res.data.msg,
						icon: 'none'
					})
				}
			})
		}
	}
}
</script>

<style lang="scss" scoped>
.container {
	min-height: 100vh;
	background-color: #f2f2f2;
}
.content {
	background-color: #fff;
	padding: 0 24rpx;
	.title {
		padding: 24rpx 0;
		border-bottom: 1rpx solid #c9c9c9;
		.icon {
			width: 50rpx;
			margin-right: 16rpx;
		}
		view {
			font-size: 36rpx;
			font-weight: bold;
		}
	}
	.box {
		padding: 40rpx 0;
	}
	.label {
		font-size: 30rpx;
		flex-shrink: 0;
	}
	.ipt {
		font-size: 26rpx;
		direction: rtl;
	}
	.pla-ipt {
		color: #a6a6a6;
	}
	.tar {
		border-radius: 8rpx;
		border: 1rpx solid #c3c3c3;
		margin-left: 32rpx;
		padding: 16rpx;
		height: 160rpx;
		font-size: 28rpx;
	}
}
.btn-wrap {
	height: 160rpx;
	.bottom {
		padding: 24rpx 32rpx;
		position: fixed;
		bottom: 0;
		height: 160rpx;
		box-sizing: border-box;
		display: flex;
		width: 100%;
		z-index: 99;
		.btn {
			width: 100%;
			height: 98rpx;
			background-color: #0f68f0;
			text-align: center;
			line-height: 98rpx;
			font-size: 38rpx;
			color: #fff;
			border-radius: 12rpx;
		}
		.btn2 {
			width: 44%;
			height: 98rpx;
			line-height: 98rpx;
			font-size: 38rpx;
			color: #fff;
			border-radius: 12rpx;
			text-align: center;
		}
		.bg-green {
			background-color: rgba(126, 207, 81, 1);
		}
		.bg-blue {
			background-color: #0f68f0;
		}
	}
}
</style>